<script setup>
// 企业认证
import { ref,onMounted,reactive} from 'vue'
import { vipinfoApi, entercodeApi, authenticationApi } from '../../api/index'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useStorage } from '@vueuse/core'
const listinfo = ref([])
const codeshow = ref(true)
const timedoe = ref(30)
const info = reactive({
    Apply_Enterprise_Title: '',
    Apply_Enterprise_Code: '',
    PhoneCode: '',
})
const phone = ref('')
const disb = ref()
const getinfo = async function () {
  const msg = await vipinfoApi()
    if (msg.data.code == 0) {
        listinfo.value = msg.data.data
        if (msg.data.data.apply_Enterprise_Authentication == 2 || msg.data.data.apply_Enterprise_Authentication == 1) {
            disb.value = true
        } else {
            disb.value = false
        }
        if (msg.data.data.apply_Enterprise_Authentication == 2) {
            info.Apply_Enterprise_Title = msg.data.data.enterpriseTitle
            info.Apply_Enterprise_Code = msg.data.data.enterpriseCode
        } else {
            info.Apply_Enterprise_Title = msg.data.data.apply_Enterprise_Title
            info.Apply_Enterprise_Code = msg.data.data.apply_Enterprise_Code
        }
  }
}
// 获取验证码
const getcode = async function () {
    const msg = await entercodeApi({
        Phone:phone.value
    })
    if (msg.data.code==0) {
    } else {
        ElMessage.error(msg.data.msg)
    }
}


// 获取验证码
const havecode = function () {
    if (phone.value == '' || phone.value.length !== 11) {
        ElMessage.error('请填写正确的手机号')
    } else {
        codeshow.value = false
        let index = setInterval(() => {
                timedoe.value--
            if (timedoe.value <= 0) {
                clearInterval(index)
                codeshow.value = true
                timedoe.value = 30
            }
        }, 1000)
        getcode()
    }
}
// 提交认证
const auttion = async function () {
    const msg = await authenticationApi(info)
    if (msg.data.code == 0) {
        ElMessage({
      message: msg.data.msg,
      type: 'success',
    })
        getinfo()
    } else {
        ElMessage.error(msg.data.msg)
    }
}

onMounted(() => {
  if (useStorage('token').value !== undefined) {
     getinfo()
  }
})


</script>
<template>
    <div class="member_right">
    <div class="tixian_left">
        <div class="zk_tou"><span class="zk_tou_left">企业认证：</span></div>
        <div class="tx"><i></i>请填写提现信息</div>
        <div class="yhk">
            <el-form
                :label-position="labelPosition"
                label-width="auto"
                style="max-width: 600px"
            >
                <el-form-item label="公司名称：">
                <el-input style="width: 265px;" :disabled="disb" v-model="info.Apply_Enterprise_Title" />
                </el-form-item>
                <el-form-item label="企业组织机构代码：">
                <el-input style="width: 265px;" :disabled="disb" v-model="info.Apply_Enterprise_Code" />
                </el-form-item>
                <el-form-item label="手机号码：" v-if="listinfo.apply_Enterprise_Authentication == 0 || listinfo.apply_Enterprise_Authentication == 3">
                <el-input style="width: 265px;" :disabled="disb" v-model="phone" />
                </el-form-item>
                <el-form-item label="验 证 码：" v-if="listinfo.apply_Enterprise_Authentication == 0 || listinfo.apply_Enterprise_Authentication == 3">
                        <el-input style="width: 150px;margin-right: 15px;" v-model="info.PhoneCode"></el-input>
                        <el-button  v-if="codeshow" @click="havecode" style="background-color: #026AB4;color:#FFF">获取验证码</el-button>
                        <el-button v-if="!codeshow" style="background-color: #026AB4;color:#FFF">{{ timedoe }}</el-button>
                </el-form-item>
            </el-form>
            <div style="display: flex;justify-content: center;margin-top: 40px;" v-if="listinfo.apply_Enterprise_Authentication == 0 || listinfo.apply_Enterprise_Authentication == 3">
                <el-button  type="primary" @click="auttion">提交认证</el-button>
            </div>
        <!-- <dl>
                <dt>公司名称：</dt>
                <dd>
                <label for="textfield"></label>
                    <el-input style="width: 266px;"  :disabled="disb" v-model="info.Apply_Enterprise_Title"></el-input>
                </dd>
            </dl>
        <dl>
                <dt>企业组织机构代码：</dt>
            <dd>
                <el-input style="width: 266px;" :disabled="disb" v-model="info.Apply_Enterprise_Code"></el-input>
                </dd>
            </dl>
        <dl v-if="listinfo.apply_Enterprise_Authentication == 0 || listinfo.apply_Enterprise_Authentication == 3">
                <dt>手机号码：</dt>
                <dd>
                    <el-input style="width: 266px;" :disabled="disb" v-model="phone"></el-input>
                </dd>
            </dl>
        <dl v-if="listinfo.apply_Enterprise_Authentication == 0 || listinfo.apply_Enterprise_Authentication == 3">
                <dt>验 证 码：</dt>
                <dd>
                <label for="textfield"></label>
                        <el-input style="width: 146px;margin-right: 15px;" v-model="info.PhoneCode"></el-input>
                        <el-button  v-if="codeshow" @click="havecode()" style="background-color: #026AB4;color:#FFF">获取验证码</el-button>
                        <el-button v-if="!codeshow" style="background-color: #026AB4;color:#FFF">{{ timedoe }}</el-button>
                </dd>
            </dl>
            <dl>
                <dt>&nbsp;</dt>
                <dd> <el-button v-if="listinfo.apply_Enterprise_Authentication == 0 || listinfo.apply_Enterprise_Authentication == 3" type="primary" @click="auttion">提交认证</el-button></dd>
            </dl> -->
        </div>
    </div>
    </div>
      <div style="clear:both;"></div>
</template>